<template>
    <div id="privileges-users-list">
        <Row type="flex" justify="end" class="code-row-bg" :gutter="16">
            <Col span="3">
                <Input icon="search" placeholder="请输入查找赛季..." v-model="search.season"/>
            </Col>
            <Col span="2">
                <Button type="primary" icon="ios-search" @click="getList()">Search</Button>
            </Col>
            <Col span="2">
                <Button type="success" icon="plus" @click="addBtn()">Add</Button>
            </Col>
        </Row>
        <br>

        <Row>
            <Table border :columns="columns" :data="dataList" :loading="loading"></Table>
        </Row>

        <Modal v-model="addEditApplyModal.show" :closable='false' :mask-closable=false :width="500">
            <h3 slot="header" style="color:#2D8CF0">编辑活动信息</h3>
            <Form ref="addEditApplyForm"
                  :model="addEditApplyForm" :label-width="100" label-position="right"
                  :rules="ruleAddEditApply">
                <FormItem label="赛事选择" prop="game">
                    <!-- <Input v-model="addEditApplyForm.name" placeholder="请输入杯赛名称"></Input> -->
                    <Cascader :data="data_game" v-model="value_game" @on-change="get_value_game"></Cascader>
                </FormItem>
                <FormItem label="赛季数" prop="season">
                    <InputNumber :min="1" v-model="addEditApplyForm.season"
                           placeholder="请输入赛季"></InputNumber>
                </FormItem>
                <FormItem label="回合数" prop="time">
                    <InputNumber :min="1" v-model="addEditApplyForm.time"
                           placeholder="请输入回合数"></InputNumber>
                </FormItem>
                <FormItem label="最高人数" prop="max">
                    <InputNumber :min="1" v-model="addEditApplyForm.max"
                           placeholder="请输入最高人数"></InputNumber>
                </FormItem>
                <FormItem label="报名截止" prop="end_time">
                    <DatePicker :value="addEditApplyForm.end_time" size="large" type="datetime" placeholder="请选择时间" placement="right" @on-change="get_end_time"></DatePicker>
                </FormItem>
                <FormItem label="比赛时间" prop="play_time">
                    <DatePicker :value="addEditApplyForm.play_time" size="large" type="datetime" placeholder="请选择时间" placement="right" @on-change="get_play_time"></DatePicker>
                </FormItem>
                <FormItem label="比赛地点：" prop="play_place">
                    <div style="display:inline-block;width:100%">
                        <Input v-model="addEditApplyForm.play_place"></Input>
                    </div>
                </FormItem>
                <FormItem label="比赛费用：" prop="play_cost">
                    <div style="display:inline-block;width:100%">
                        <Input v-model="addEditApplyForm.play_cost">
                            <span slot="append">元</span>
                        </Input>
                    </div>
                </FormItem>
                <FormItem label="详情：" prop="play_detail">
                    <div style="display:inline-block;width:100%">
                        <Input v-model="addEditApplyForm.play_detail"></Input>
                    </div>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="text" @click="cancelEditPass">取消</Button>
                <Button type="primary" @click="handleSubmit" :loading="addEditApplyModal.saveLoading">保存</Button>
            </div>
        </Modal>

        <Modal v-model="setApplyModal.show" :closable='false' :mask-closable=false :width="500">
            <h3 slot="header" style="color:#2D8CF0">设置抽签信息</h3>
            <Form ref="setApplyForm"
                  :model="setApplyForm" :label-width="100" label-position="right"
                  :rules="ruleSetApply">

                <FormItem label="分拨数" prop="group">
                    <InputNumber :min="1" v-model="setApplyForm.group"
                           placeholder="请输入分拨数"></InputNumber>
                </FormItem>
                <FormItem label="裁判数" prop="referee">
                    <InputNumber :min="0" v-model="setApplyForm.referee"
                           placeholder="请输入裁判数"></InputNumber>
                </FormItem>
                <FormItem label="场次数" prop="round">
                    <InputNumber :min="1" v-model="setApplyForm.round"
                           placeholder="请输入场次数"></InputNumber>
                </FormItem>
                <FormItem label="总档位数" prop="levels">
                    <InputNumber :min="0" v-model="setApplyForm.levels"
                           placeholder="请输入总档位数"></InputNumber>
                </FormItem>
                <p style="margin-left:10%;margin-bottom:20px;color:rgb(45, 140, 240)">分档设置</p>
                <FormItem label="裁判所在档位" prop="referee_level">
                    <Select v-model="setApplyForm.referee_level">
                        <Option :value="0">门将档</Option>
                        <Option :value="1">一档</Option>
                        <Option :value="2">二档</Option>
                        <Option :value="3">三挡</Option>
                        <Option :value="4">四挡</Option>
                        <Option :value="5">五挡</Option>
                        <Option :value="6">六挡</Option>
                        <Option :value="7">七挡</Option>
                        <Option :value="8">八挡</Option>
                        <Option :value="9">九挡</Option>
                    </Select>
                </FormItem>
                <div v-for="(item,index) in players" :key="index">
                    <FormItem :label="item.user_name">
                        <Select v-model="item.user_level">
                            <Option :value="0">门将档</Option>
                            <Option :value="1">一档</Option>
                            <Option :value="2">二档</Option>
                            <Option :value="3">三挡</Option>
                            <Option :value="4">四挡</Option>
                            <Option :value="5">五挡</Option>
                            <Option :value="6">六挡</Option>
                            <Option :value="7">七挡</Option>
                            <Option :value="8">八挡</Option>
                            <Option :value="9">九挡</Option>
                        </Select>
                    </FormItem>
                </div>
                
            </Form>
            <div slot="footer">
                <Button type="text" @click="cancelEditPass">取消</Button>
                <Button type="primary" @click="handleSubmitSet" :loading="setApplyModal.saveLoading">保存</Button>
            </div>
        </Modal>
    </div>

</template>


<script>
    export default {
        data() {
            return {
                loading: false,
                search: {
                    season: null,
                },
                addEditApplyModal: {
                    show: false,
                    saveLoading: false,
                },
                setApplyModal: {
                    show: false,
                    saveLoading: false,
                },
                ruleAddEditApply: {
                    
                },
                ruleSetApply: {
                    
                },
                leagueList: [],
                cupList: [],
                value_game: [],
                data_game: [{
                    value: 'L',
                    label: '联赛',
                    children: []
                }, {
                    value: 'C',
                    label: '杯赛',
                    children: []
                }],
                addEditApplyForm: {
                    id: 0,
                    apply_type: '',
                    league_id: 0,
                    cup_id: 0,
                    name:'',
                    season: 0,
                    time: 0,
                    max: 0,
                    end_time: '',
                    play_time: '',
                    play_place: '',
                    play_cost: '',
                    play_detail: ''
                },
                setApplyForm: {
                    group: 0,
                    referee: 0,
                    round: 0,
                    levels: 0,
                    referee_level: -1
                },
                dataList: [],
                players:[],
                columns: [
                    {
                        title: 'ID',
                        key: 'id',
                        sortable: true,
                        width: 100
                    },
                    {
                        title: '赛制',
                        render: (h, params) => {
                            let re = "";
                            if (params.row.apply_type == 'L') {
                                re = "联赛";
                            } else if (params.row.apply_type == 'C') {
                                re = "杯赛";
                            } else {
                                re = "未知";
                            }
                            return h("div", re);
                        }
                    },
                    {
                        title: '名称',
                        key: 'name',
                        /*render: (h, params) => {
                            let re = "";
                            if (params.row.apply_type == 'L') {
                                for(let item in this.leagueList){
                                    if(this.leagueList[item].id == params.row.league_id){
                                        re = this.leagueList[item].name;
                                        break;
                                    }
                                }
                            } else if (params.row.apply_type == 'C') {
                                for(let item in this.cupList){
                                    if(this.cupList[item].id == params.row.cup_id){
                                        re = this.cupList[item].name;
                                        break;
                                    }
                                }
                            } else {
                                re = "未知";
                            }
                            return h("div", re);
                        }*/
                    },
                    {
                        title: '赛季回合',
                        render: (h, params) => {
                            let re = "第"+params.row.season+"赛季"+"，第"+params.row.time+"回合";
                            return h("div", re);
                        }
                    },
                    {
                        title: '截止日期',
                        key: 'end_time'
                    },
                    {
                        title: '抽签开关',
                        key: 'enable',
                        render: (h, params) => {
                            return h('i-switch', {
                                props: {
                                    slot: 'open',
                                    type: 'primary',
                                    value: params.row.enable === 'T',  //控制开关的打开或关闭状态，官网文档属性是value
                                },
                                on: {
                                    'on-change': (value) => {
                                        if(params.row.enable == 'T'){
                                            params.row.enable = 'F';
                                        }else{
                                            params.row.enable = 'T';
                                        }
                                        this.switchEnable(params.row.id,params.row.enable)
                                    }
                                }
                            });
                        }
                    },
                    {
                        title: '操作',
                        render: (h, params) => {
                            let t = this;
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'success',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            t.addEditApplyForm = t.dataList[params.index];
                                            //console.log(t.dataList[params.index]);
                                            t.addEditApplyForm.season = parseInt(t.addEditApplyForm.season);
                                            t.addEditApplyForm.time = parseInt(t.addEditApplyForm.time);
                                            t.addEditApplyForm.max = parseInt(t.addEditApplyForm.max);
                                            //t.value_game[0] = t.addEditApplyForm.apply_type;
                                            if(t.addEditApplyForm.apply_type == 'L'){
                                                t.addEditApplyForm.league_id = parseInt(t.addEditApplyForm.league_id);
                                                //t.value_game[1] = t.addEditApplyForm.league_id;
                                                t.value_game = ['L', t.addEditApplyForm.league_id];
                                            }else if(t.addEditApplyForm.apply_type == 'C'){
                                                t.addEditApplyForm.cup_id = parseInt(t.addEditApplyForm.cup_id);
                                                //t.value_game[1] = t.addEditApplyForm.cup_id;
                                                t.value_game = ['C', t.addEditApplyForm.cup_id];
                                            }
                                            t.addEditApplyModal.show = true;
                                        }
                                    }

                                }, '编辑'),
                                h('Button', {
                                    props: {
                                        type: 'info',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            let argu = {apply_id: params.row.id};
                                            this.$router.push({
                                                name: 'edit-apply',
                                                params: argu
                                            });
                                            /*console.log(t.dataList[params.index].id);
                                            t.$util.ajax.get('/admin/applys/' + t.dataList[params.index].id).then(function (response) {
                                                let response_data = response.data;
                                                console.log(response_data);
                                                if(response_data.status == 'success'){
                                                    t.players = [];
                                                    for(let item in response_data.data.applyHasPlayer){
                                                        let obj = {
                                                            user_id:response_data.data.applyHasPlayer[item].user_id,
                                                            user_level:parseInt(response_data.data.applyHasPlayer[item].user_level),
                                                            user_name:response_data.data.applyHasPlayer[item].user.realname
                                                        }
                                                        t.players.push(obj);
                                                    }
                                                    console.log(t.players);
                                                }
                                            }, function (error) {
                                                t.$Notice.warning({
                                                    title: '出错了',
                                                    desc: error.message
                                                });
                                            });
                                            t.setApplyForm = t.dataList[params.index];
                                            //console.log(t.dataList[params.index]);
                                            t.setApplyForm.group = parseInt(t.setApplyForm.group);
                                            t.setApplyForm.referee = parseInt(t.setApplyForm.referee);
                                            t.setApplyForm.round = parseInt(t.setApplyForm.round);
                                            t.setApplyForm.levels = parseInt(t.setApplyForm.levels);
                                            t.setApplyForm.referee_level = parseInt(t.setApplyForm.referee_level);
                                            t.setApplyModal.show = true;*/
                                        }
                                    }

                                }, '设置'),
                                /*h('Poptip', {
                                    props: {
                                        confirm: true,
                                        title: '您确定要删除「'+params.row.name+'」角色？',
                                        transfer: true
                                    },
                                    on: {
                                        'on-ok': () => {
                                            t.deleteBtn(params.row.id, params.index);
                                        }
                                    }
                                }, [
                                    h('Button', {
                                        style: {
                                            margin: '0 5px'
                                        },
                                        props: {
                                            type: 'error',
                                            size: 'small',
                                            placement: 'top'
                                        }
                                    }, '删除'),
                                ])*/
                            ]);
                        },
                    },
                ]
            }
        },

        created() {
            let t = this;
            t.getList();
            t.getLeagueList();
            t.getCupList();
        },
        methods: {
            getLeagueList() {
                let t = this;
                t.$util.ajax.get('/admin/leagues').then(function (response) {
                    let response_data = response.data;
                    t.leagueList = response_data.data;
                    console.log(t.leagueList);
                    for(let item in t.leagueList){
                        var obj = {
                            value: t.leagueList[item].id,
                            label: t.leagueList[item].name
                        }
                        t.data_game[0].children.push(obj);
                    }
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                })
            },
            getCupList() {
                let t = this;
                t.$util.ajax.get('/admin/cups').then(function (response) {
                    let response_data = response.data;
                    t.cupList = response_data.data;
                    console.log(t.cupList);
                    for(let item in t.cupList){
                        var obj = {
                            value: t.cupList[item].id,
                            label: t.cupList[item].name
                        }
                        t.data_game[1].children.push(obj);
                    }
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                })
            },
            get_value_game(e){
                console.log(e);
                this.value_game = e;
                this.addEditApplyForm.apply_type = this.value_game[0];
                if( this.addEditApplyForm.apply_type == 'L' ){
                    this.addEditApplyForm.league_id = this.value_game[1];
                    for(let item in this.leagueList){
                        if(this.leagueList[item].id == this.addEditApplyForm.league_id){
                            this.addEditApplyForm.name = this.leagueList[item].name;
                            break;
                        }
                    }
                }else if( this.addEditApplyForm.apply_type == 'C' ){
                    this.addEditApplyForm.cup_id = this.value_game[1];
                    for(let item in this.cupList){
                        if(this.cupList[item].id == this.addEditApplyForm.cup_id){
                            this.addEditApplyForm.name = this.cupList[item].name;
                            break;
                        }
                    }
                }
                
            },
            get_end_time(e){
                console.log(e);
                this.addEditApplyForm.end_time = e;
            },
            get_play_time(e){
                console.log(e);
                this.addEditApplyForm.play_time = e;
            },
            switchEnable(id, enable) {
                let t = this;
                t.$util.ajax.post('/admin/applys/status', {
                    id: id,
                    status: enable
                }).then(function (response) {
                    let response_data = response.data;
                    t.$Notice.success({
                        title: response_data.message
                    })
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                })
            },
            handleSubmit() {
                let t = this;
                t.$refs.addEditApplyForm.validate((valid) => {
                    if (valid) {
                        t.addEditApplyModal.saveLoading = true;
                        t.$util.ajax.post('/admin/applys', t.addEditApplyForm).then(function (response) {
                            let response_data = response.data;
                            t.$Notice.success({
                                title: response_data.message
                            });
                            t.getList();
                            t.addEditApplyModal.saveLoading = false;
                            t.addEditApplyModal.show = false;
                        }, function (error) {
                            t.$Notice.warning({
                                title: '出错了',
                                desc: error.message
                            });
                            t.addEditApplyModal.saveLoading = false;
                        })
                    }
                });
            },
            handleSubmitSet(){
                let t = this;
                console.log(t.players);
                console.log(t.setApplyForm.group);
                console.log(t.setApplyForm.referee);
                console.log(t.setApplyForm.round);
                console.log(t.setApplyForm.levels);
                console.log(t.setApplyForm.referee_level);
                t.$refs.setApplyForm.validate((valid) => {
                    if (valid) {
                        t.setApplyModal.saveLoading = true;
                        var params = {
                            setApplyForm: t.setApplyForm,
                            players: t.players
                        }
                        t.$util.ajax.put('/admin/applys',params).then(function (response) {
                            let response_data = response.data;
                            if(response_data.status == 'success'){
                                
                            }
                            t.getList();
                            t.setApplyModal.saveLoading = false;
                            t.setApplyModal.show = false;
                        }, function (error) {
                            t.$Notice.warning({
                                title: '出错了',
                                desc: error.message
                            });
                            t.setApplyModal.saveLoading = false;
                        })
                    }
                });
            },
            cancelEditPass() {
                let t = this;
                t.addEditApplyModal.show = false;
                t.addEditApplyModal.saveLoading = false;
                t.setApplyModal.show = false;
                t.setApplyModal.saveLoading = false;
                t.cleanModal();
                t.getList();
            },
            cleanModal() {
                let t = this;
                t.value_game = [];
                t.addEditApplyForm = {
                    id: 0,
                    apply_type: '',
                    league_id: 0,
                    cup_id: 0,
                    name:'',
                    season: 0,
                    time: 0,
                    max: 0,
                    end_time: '',
                    play_time: '',
                    play_place: '',
                    play_cost: '',
                    play_detail: ''
                };
                t.setApplyForm = {
                    group: 0,
                    referee: 0,
                    round: 0,
                    levels: 0,
                    referee_level: -1
                };
            },
            addBtn() {
                this.cleanModal();
                this.addEditApplyModal.show = true;
            },
            getList() {
                let t = this;
                t.loading = true;
                t.$util.ajax.get('/admin/applys?search_data=' + JSON.stringify(t.search)).then(function (response) {
                    let response_data = response.data;
                    t.dataList = response_data.data;
                    t.loading = false;
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                    t.loading = false;
                })
            },
            /*deleteBtn(role, key) {
                let t = this;
                t.$util.ajax.delete('/admin/roles/' + role).then(function (response) {
                    let response_data = response.data;
                    t.dataList.splice(key, 1);
                    t.$Notice.success({
                        title: response_data.message
                    });
                }, function (error) {

                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                });
            },*/
        },
    }
</script>
